<template>
	<a-modal
		v-model:visible="visible"
		:title="title"
		:width="800"
		:mask-closable="false"
		:destroy-on-close="true"
		@ok="handleOk"
		@cancel="handleClose"
	>
		<a-form ref="formRef" :model="formData" :rules="formRules" layout="vertical">
			<a-form-item label="检查项：" name="checkItem">
				<a-input v-model:value.trim="formData.checkItem" placeholder="请输入检查项" allow-clear/>
			</a-form-item>
			<a-form-item label="描述：" name="checkDes">
				<a-textarea v-model:value="formData.checkDes" placeholder="请输入描述(最多120个字)" :rows="4" showCount="true" maxlength="120"/>
			</a-form-item>
			<a-form-item label="适用场景：" name="checkSwitch">
				<a-row>
					<a-col :span="12">借用检查：
						<a-switch v-model:checked="borrowCheck" checked-children="启用"
								  un-checked-children="关闭"/>
					</a-col>
					<a-col :span="12">归还检查：
						<a-switch v-model:checked="returnInsp" checked-children="启用"
								  un-checked-children="关闭"/>
					</a-col>
				</a-row>
			</a-form-item>
		</a-form>
	</a-modal>
</template>

<script setup name="goodsCheckItems">
	// 弹窗是否打开
	import {required} from "@/utils/formRules";
	import {cloneDeep} from "lodash-es";
	import bizGoodsApi from "@/api/biz/bizGoodsApi";
	import {message} from "ant-design-vue";

	let visible = $ref(false)
	const emit = defineEmits({onBack: null})
	const formRef = ref()
	// 表单数据
	const formData = ref({})
	const borrowCheck = ref(false)
	const returnInsp = ref(false)
	const title = ref('新增检查项')

	// 默认要校验的
	const formRules = {
		checkItem: [required('请输入检查项')],
		checkDes: [required('请输入检查内容')],
	}

	// 打开弹框
	const onOpen = (data) => {
		visible = true
		if (data) {
			let recordData = cloneDeep(data)
			if (recordData.borrowCheck === 1) {
				borrowCheck.value = true
			}
			if (recordData.returnInsp === 1) {
				returnInsp.value = true
			}
			formData.value = Object.assign({}, recordData)
			title.value = '编辑检查项'
		} else {
			title.value = '新增检查项'
		}
	}

	//确定
	const handleOk = () => {
		if (!borrowCheck.value && !returnInsp.value) {
			message.warning('请至少选择一个适用场景')
			return false
		}
		formRef.value
			.validate()
			.then(() => {
				const formDataParam = cloneDeep(formData.value)
				formDataParam.borrowCheck = borrowCheck.value ? 1 : 0
				formDataParam.returnInsp = returnInsp.value ? 1 : 0
				formDataParam.state = 1
				if (formDataParam) {
					emit('onBack', formDataParam)
				}
				handleClose()
			})
	}

	//关闭
	const handleClose = () => {
		formRef.value.resetFields()
		formData.value = {}
		borrowCheck.value = false
		returnInsp.value = false
		visible = false
	}

	defineExpose({
		onOpen
	})
</script>
